<%--
  Created by IntelliJ IDEA.
  User: hubin
  Date: 2016/6/14
  Time: 10:30
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<div class="widget-title"><span class="icon"> <i class="icon-briefcase"></i> </span>
    <h5>理 财 产 品</h5>

    <span class="label label-info"> <a href="#myModal" data-toggle="modal" data-dismiss="modal"><span
            style="color: #ffffff">添加产品</span></a></span>
</div>
<div class="widget-content" ms-controller="product">

    <div style="width: 100%;height:40px;text-align: center;">

        <div style="width: 600px;height: 40px; margin-left: auto;margin-right: auto;">

            <input placeholder="标题" type="text" class="span1" style="height: 40px;width: 500px;float: left; "
                   ms-duplex="@keyword">

            <div style=" height:40px;width: 100px;background-color: #2a65ff ;float: left;text-align: center;"
                 ms-click="@cheak()">
                <p style="line-height: 40px;height: 40px;margin-left: auto;margin-right: auto;color: #ffffff;size: 12px;">
                    查询</p>
            </div>
        </div>
    </div>
    <div class="row-fluid" style="clear: both;text-align: center;">
        <div class="span2" style="height: 250px;background-color: #ffffff;float: left;margin: 10px;"
             ms-for="(index,el) in @productlist" ms-click="@update(el)">
            <div ms-if="index % 6 == 0 " style="width: 100%;height: 10px;background-color: #08ff0a"></div>
            <div ms-if="index % 6 == 1 " style="width: 100%;height: 10px;background-color: #31ffe4"></div>
            <div ms-if="index % 6 == 2 " style="width: 100%;height: 10px;background-color: #1fc0ff"></div>
            <div ms-if="index % 6 == 3 " style="width: 100%;height: 10px;background-color: #c93cff"></div>
            <div ms-if="index % 6 == 4 " style="width: 100%;height: 10px;background-color: #ff27b5"></div>
            <div ms-if="index % 6 == 5 " style="width: 100%;height: 10px;background-color: #ff111d"></div>
            <div style="text-align: center">
                <h4 style="margin-left: auto;margin-left: auto;">{{el.title}}</h4>
            </div>
            <div>
                <p style="margin-left: 15px;margin-right: 15px;margin-top: 30px;">
                    {{el.introduce}}</p>
            </div>
            <div style="text-align: center;margin-top: 30px;">
                <p style="margin-right: auto;margin-left: auto;"><span style="color: #ff9827;font-size: 50px;">{{el.rate}}</span><span
                        style="color: #ff9827;font-size: 15px;">%</span></p>
            </div>
            <div ms-if="el.isexpire == true">
                <p style="margin-left: 15px;margin-right: 15px;margin-top: 30px;">
                    <span style="color: #2cc30b">    【已下架】 </span></p>
            </div>
            <div ms-if="el.isexpire == false">
                <p style="margin-left: 15px;margin-right: 15px;margin-top: 30px;">
                    <span style="color: #ff111d">    【正在售卖中】 </span></p>
            </div>
        </div>


    </div>
    <div style=" height: 30px;"
         class="dataTables_paginate fg-buttonset ui-buttonset fg-buttonset-multi ui-buttonset-multi paging_full_numbers">
        <a style=" height: 30px;width: 40px; line-height:30px;text-align: center ;"
           class="first ui-corner-tl ui-corner-bl fg-button ui-button ui-state-default" ms-click="@firstPage()">首页</a>
        <a style=" height: 30px;width: 40px;line-height:30px;text-align: center ;"
           class="previous fg-button ui-button ui-state-default " ms-click="@previousPage()">上一页</a>
        <span>
        <a style=" height: 30px;width: 100px;line-height:30px;text-align: center ;"
           class="fg-button ui-button ui-state-default">{{@pageCurrent}} / {{@pageTotle}}</a>

        </span>
        <a style=" height: 30px;width: 40px;line-height:30px;text-align: center ;"
           class="next fg-button ui-button ui-state-default" ms-click="@nextPage()">下一页</a>
        <a style=" height: 30px;width: 40px;line-height:30px;text-align: center ;"
           class="last ui-corner-tr ui-corner-br fg-button ui-button ui-state-default" ms-click="@lastPage()"
        >尾页</a>
    </div>
    <!-- 添加产品 -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" style="display: none;"
         aria-labelledby="myModalLabel" aria-hidden="false">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close"
                            data-dismiss="modal" aria-hidden="true">
                        &times;
                    </button>
                    <h4 class="modal-title" id="myModalLabel">
                        添加产品
                    </h4>
                </div>
                <div class="modal-body">

                    <div class="control-group">
                        <label class="control-label">产品名称 :</label>
                        <div class="controls">
                            <input type="text" class="span12" placeholder="请输入产品名称" ms-duplex="@productItem.title"/>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">利率 :</label>
                        <div class="controls">
                            <input type="text" class="span12" placeholder="请输入产品利率" ms-duplex="@productItem.rate"/>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">到期时间 :</label>
                        <div class="controls">
                            <input id="addtproductime" type="text" class="span12" placeholder="请输入产品下架时间"
                                   ms-duplex="@productItem.createDate"/>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">产品介绍 :</label>
                        <div class="controls">
                            <textarea class="span12" placeholder="请输入产品详细介绍"
                                      ms-duplex="@productItem.introduce"></textarea>
                        </div>
                    </div>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default"
                            data-dismiss="modal">关闭
                    </button>
                    <button type="button" class="btn btn-primary" ms-click="@addProduct()">
                        添加
                    </button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>


    <div class="modal fade" id="updateModel" role="dialog" style="display: none;" aria-hidden="false">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close"
                            data-dismiss="modal" aria-hidden="true">
                        &times;
                    </button>
                    <h4 class="modal-title">
                        话题详情
                    </h4>
                </div>
                <div class="modal-body">

                    <div class="control-group">
                        <label class="control-label">产品名称 :</label>
                        <div class="controls">
                            <input type="text" class="span12" placeholder="请输入产品名称" ms-duplex="@updateItem.title"/>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">利率 :</label>
                        <div class="controls">
                            <input type="text" class="span12" placeholder="请输入产品利率" ms-duplex="@updateItem.rate"/>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">到期时间 :</label>
                        <div class="controls">
                            <input id="EndDate" type="text" class="span12 form-control m-ctrl-medium date-picker"
                                   placeholder="请输入产品下架时间"
                                   ms-duplex="@updateItem.createDate"/>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">产品介绍 :</label>
                        <div class="controls">
                            <textarea class="span12" placeholder="请输入产品详细介绍"
                                      ms-duplex="@updateItem.introduce"></textarea>
                        </div>
                    </div>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default"
                            data-dismiss="modal">关闭
                    </button>

                    <button type="button" class="btn btn-default"
                            data-dismiss="modal" ms-if="@updateItem.isexpire == false" ms-click="@Took()">
                        下架
                    </button>
                    <button type="button" class="btn btn-default" ms-click="@delProduct()"
                            data-dismiss="modal">删除
                    </button>
                    <button type="button" class="btn btn-primary" ms-click="@updateProduct()">
                        修改
                    </button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>
</div>


